<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>发送UDP命令</title>
</head>
<body>
    <h2>投影机</h2>
    <select name="" id="selectbtn">
        <option value="5001">左侧端口号</option>
        <option value="5000">正面端口号</option>
        <option value="5002">右侧端口号</option>
    </select>
    <button id="tyopen">投影机开机</button>
    <button id="tyclose">投影机关机</button>
    <hr>
    <h2>融合器</h2>
    
    <button id="rhopen">融合器开机</button>
    <button id="rhclose">融合器关机</button>

    <script>
        const tyopen = document.getElementById('tyopen');
        const tyclose = document.getElementById('tyclose');
        const rhopen = document.getElementById('rhopen');
        const rhclose = document.getElementById('rhclose');
        const selectbtn = document.getElementById('selectbtn');
        let tyurl = 'ws://192.168.2.5:5000'; // 投影仪ip
        let rhurl = 'ws://192.168.2.168:63472'; // 融合器ip
        const socket = new WebSocket(tyurl);
        const socketrh = new WebSocket(rhurl);

        function sendudp(cmd) {
            const commandArray = cmd;
            const commandBuffer = new Uint8Array(commandArray);
            return commandBuffer;
        }

        selectbtn.addEventListener('change',(e)=>{
            console.log(e.target.value)
            const num = Number(e.target.value)
            let tyurl = `ws://192.168.2.5:${num}`;
        })
        socket.addEventListener('open', () => {
            console.log('WebSocket连接已建立');
        });

       

        tyopen.addEventListener('click', () => {
            const commandArray = [0x44, 0x58, 0x01, 0x00, 0x00, 0x01]; // 投影仪开机指令
            const commandBuffer = sendudp(commandArray);
            socket.send(commandBuffer);
            console.log('投影仪开机UDP命令已发送:', commandArray,commandBuffer);
        });

        tyclose.addEventListener('click', () => {
            const commandArray = [0x44, 0x58, 0x02, 0x00, 0x00, 0x02];
            const commandBuffer = new Uint8Array(commandArray); // 投影仪关机机指令
            socket.send(commandBuffer);
            console.log('投影仪关机命令已发送:', commandArray);
        });

        socket.addEventListener('message', (event) => {
            console.log('来自服务器的消息:', event.data);
        });

        socket.addEventListener('close', () => {
            console.log('WebSocket连接已关闭');
        });

        socket.addEventListener('error', (error) => {
            console.error('WebSocket错误:', error);
        });
        ///// ---------------------------------------
        socketrh.addEventListener('open', () => {
            console.log('融合器WebSocket连接已建立');
        });
        rhopen.addEventListener('click', () => {
            const commandArray = [0x3C, 0x70, 0x6F, 0x77, 0x65, 0x72,0x5F,0x6F,0x6E,0x3E]; // 融合器开机指令
            const commandBuffer = sendudp(commandArray);
            console.log('融合器开机UDP命令已发送:', commandArray,commandBuffer);
            socket.send(commandBuffer);
        });

        rhclose.addEventListener('click', () => {
            const commandArray = [0x3C, 0x70, 0x6F, 0x77, 0x65, 0x72,0x5F,0x6F,0x6E,0x66,0x66,0x3E]; // 融合器关机指令
            const commandBuffer = new Uint8Array(commandArray);
            console.log('融合器关机命令已发送:', commandArray);
            socket.send(commandBuffer);
        });

        socketrh.addEventListener('message', (event) => {
            console.log('融合器来自服务器的消息:', event.data);
        });

        socketrh.addEventListener('close', () => {
            console.log('融合器WebSocket连接已关闭');
        });

        socketrh.addEventListener('error', (error) => {
            console.error('融合器WebSocket错误:', error);
        });
    </script>
</body>
</html>
